﻿@model IEnumerable<LS.Models.CardManageModel>

@{
    ViewBag.Title = "Index";
}

<script type="text/javascript" src="/Scripts/jquery.tablesorter.js"></script>
<link href="~/Content/tablesorterui/blue/style.css" rel="stylesheet" />
<h2>My Cards

    @*@Html.ActionLink("Add New", "Create", null, new { @class = "btn btn-primary"})*@
    <a class="btn btn-primary" style="float: right;" href="/MyCard/Create/" data-toggle="modal" data-target="#myModal">Add New</a>
</h2>
<div id="MyCardList">
    @Html.Partial("MyCardList", Model)
</div>
<!-- Modal -->
<div class="modal fade" id="myModal"></div>
<div class="modal fade" id="eidtModal"></div>
<script type="text/javascript">
    //$(document).ready(function () {
    //    $("#myTable").tablesorter();
    //}
    //);
    //$(document).ready(function () {
    //    $("#myTable").tablesorter({ sortList: [[0, 0], [1, 0]] });
    //}
    //);
    $('body').on('hidden', '.modal', function () {
        $(this).removeData('modal');
    });

    $("a[data-toggle=modal]").click(function () {
        //var target = $(this).attr('data-target');
        var url = $(this).attr('href');
        var modal_id = $(this).attr('data-target');
        //$(target).load(url);
        $.get(url, function (data) {
            $( modal_id).empty();
            $( modal_id).html(data);
            $( modal_id).modal('show');
        });

        $.get(url, function (data) {
            $(data).modal();
        });
    });

    //$("a[data-target=#myModal]").click(function (ev) {
    //    ev.preventDefault();
    //    var target = $(this).attr("href");
    //    $('#myModal').empty();
    //    // load the url and show modal on success
    //    $("#myModal").load(target, function () {
    //        ;
    //        $("#myModal").modal("show");
    //    });
    //});
    function LoadMyCards(newCard) {
        //alert('loading my cards...');
        //$("#tbody_mycards").prepend('<tr><td><a class="btn" href="/MyCard/Edit/?MemberCardId="' + newCard.Id + 'data-toggle="modal" data-target="#myModal">' + newCard.RelatedCard.SeiralNumber + '</a></td><td>' + newCard.ExpireDate.toString('yyyy-MM-dd') + '</td><td>' + newCard.Description + '</td><td>InService</td><td><a href="/LFH/IFindIt?SeiralNumber=' + newCard.RelatedCard.SeiralNumber + '">' + newCard.RelatedCard.SeiralNumber + '</a></td></tr>');
        $.ajax({
            url: 'MyCard/MyCardList/',
            datatype: 'html',
            success: function (data) {
                $('#MyCardList').empty().html(data);
                $('#myModal').removeData();
            }
        });
    }

</script>
